<template>
	<view>
		<view class="titleBox" style="height: 128rpx; display: flex; line-height: 128rpx; font-size: 24rpx; position: relative; background-color: #fff">
			<view class="titleReturn">
				<uni-icons custom-prefix="iconfont" type="icon-xiangzuojiantou" style="font-size: 35rpx; margin-left: 10rpx" size="10"></uni-icons>
			</view>
			<view class="titleText" style="position: absolute; left: 50%; transform: translateX(-50%)">聊天详情</view>
		</view>
		<view class="tx">
			<view class="tx-nr">
				<image src="/static/image/yonghu(.png" mode=""></image>
				<p>设计师...</p>
			</view>
		</view>
		<view class="items">
			<view class="item">
				置顶聊天
				<switch />
			</view>
			<view class="item">
				消息免打扰
				<switch />
			</view>
			<view class="item">
				屏蔽拉黑
				<switch />
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {};
	}
};
</script>

<style lang="less">
page {
	background-color: #fafafa;
}
.tx {
	padding: 50rpx 30rpx;
	background-color: #fff;
	margin-bottom: 20rpx;
	.tx-nr {
		image {
			width: 100rpx;
			height: 100rpx;
			border-radius: 20rpx;
		}
		p {
			font-size: 25rpx;
		}
	}
}
.items {
	.item {
		margin-top: 7rpx;
		padding: 20rpx 20rpx;
		background-color: #fff;
		display: flex;
		justify-content: space-between;
	}
}
</style>
